<template>
  <div class="url-input">
    <select style="width:20px;cursor:pointer;" v-model="searchName">
      <option v-for="item in modelList">{{ item }}</option>
    </select>
    <input style="width: 200px;" type="text" placeholder="输入模型名称" v-model="searchName">
    <button style="margin-left:6px;cursor:pointer;" @click="onSearch">搜索</button>
  </div>
</template>

<script lang="ts" setup>
import { ref } from 'vue';

const emits = defineEmits(['search'])

const searchName = ref('huangyanpei')

const modelList = ['baoanqiao', 'diyishuchang', 'huojian', 'majiashan', 'qianqiuqiao', 'wuchangshuo', 'yonglebei', 'zhanshi', 'baoyouqiao', 'huangyanpei', 'laobaoshan', 'minshengmatou', 'ruqinhu', 'xinlongdiandang', 'zhangpeijun', 'zhujiadian', 'chongxiutang', 'huangyanpei2', 'maanqiao', 'pudongkaifabangongshi', 'taipingtianguo', 'yangxiantang', 'zhangwentian']

function onSearch() {
  console.log('正在加载-->', searchName.value);
  let url = `https://dev.wenwuyun.cn:8060/staticFiles/tiles/${searchName.value}/tileset.json`
  // primitive.value.load()
  emits('search', url)
}

</script>

<style scoped>
.url-input {
  position: absolute;
  top: 12px;
  left: 12px;
  z-index: 999;
}
</style>